<template>
  <div>
    <div class="hearder">
			<div class="h_top">
				<a class="logo" href="#"><img src="../../static/portal-img/logo.png" /></a>
				<div id="tp-weather-widget"></div>
				<div class="appdownload"><i></i><a href="#/contact" target="_blank">联系我们</a></div>

				<!-- <a class="register" href="/user/sign_in">登录</a>
				<a class="login" href="/user/sign_up">注册</a> -->


        <el-dropdown class="m_userbox">
          <el-button type="primary" class="m_user">
            <a class="elli m_user_name" href="http://passport.tongwei.cn/User/index.html#/center">纳兰馥馥</a>
            <a class="m_usr_avatar fr"><img src="http://bbs.tongwei.cn/uc_server/data/avatar/000/01/69/18_avatar_small.jpg" onerror="this.onerror=null;this.src='http://bbs.tongwei.cn/uc_server/images/noavatar_small.gif'" /></a>
          </el-button>
          <el-dropdown-menu slot="dropdown" class="m_user_con">
            <el-dropdown-item><a href="http://passport.tongwei.cn/User/index.html" target="_blank">账号设置</a></el-dropdown-item>
            <el-dropdown-item><a href="http://txh.tongwei.cn/Apply/index.html" target="_blanck">我的通心号</a></el-dropdown-item>
            <el-dropdown-item><a href="http://passport.tongwei.cn/User/collect.html" target="_blanck">我的收藏</a></el-dropdown-item>
            <el-dropdown-item><a href="http://passport.tongwei.cn/User/attention.html" target="_blanck">我的关注</a></el-dropdown-item>
            <el-dropdown-item><a href="/user/sign_out">退出登录</a></el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
				
        <div class="searchlocal">
          <div class="search">
            <input type="text" id="keywords" autocomplete="off" placeholder="请输入搜索内容" onkeydown="checkKeyDown(event)" onkeyup="checkKeyUp()" onfocus="onAjaxlist('searchlist');" onblur="offAjaxlist()" />
            <button class="btn" onclick="btn_click()"><i></i></button>
          </div>
          <div class="searchcon">
            <ul class="searchlist hidden" id="searchlist" onclick="liclick()"></ul>
            <a id="more" class="hiddenplus" onClick="del_click()">清空搜索历史</a>
          </div>
        </div>
        
			</div>
      <div class="h_con">
				<ul>
          <span v-show="LoadingNav" class="DataLoadingNav"><i></i>加载中...</span>
					<li v-for="data in nav" v-if="data.id == 1" class="on">
						<a :href="data.url" v-cloak>{{ data.name }}</a>
					</li>
					<li v-for="data in nav" v-if="data.id != 1">
						<a :href="data.url" target="_blank" v-cloak>
							<i class="h_icon_new" v-if="data.isnew == 1"></i>
							<i class="h_icon_hot" v-if="data.ishot == 1"></i>
							{{ data.name }}
						</a>
					</li>
				</ul>
			</div>
		</div>

    <transition :name="transitionName">
      <router-view class="main clearfix"></router-view>
    </transition>

    <div class="footer">
      <div class="bottom">
        <span>Copyright © 2015-2017 通心粉社区 www.tongwei.cn  |  蜀ICP备 05002048号</span>
      </div>
    </div>
  </div>
</template>

<script>
import getTransitionName from '@/modules/transition';
import Function from "@/components/Function";
import Search from "@/components/Search";

export default {
  data() {
    return {
      transitionName: 'silde-right',
      nav: [],  
      LoadingNav: true,
    }
  },
  watch: {
    '$route' (to, from) {
      this.transitionName = getTransitionName.call(this, to, from)
    }
  },
  mounted() {
    this.getNav();
  },
  methods: {
    getNav() {
      return axios
        .get("https://service.tongwei.cn/v1.3/3.1/pc/portal/navigations")
        .then(response => {
          this.nav = response.data.response_data.data.navigations.main;
          this.LoadingNav = false;
        });
    }
  },
  computed:{
    sign_in(){
      return this.$store.state.user.sign_in
    },
    name(){
      return this.$store.state.user.name
      
    },
    avatar(){
      return this.$store.state.user.avatar
    }
  }
}
</script>

<style lang="scss">
@import url("../../styles/common/portal/layout.css");
.main {
  width: 1000px;
  padding: 10px 0;
  margin: auto;
}
</style>

